import {makeAutoObservable} from 'mobx'
import {axios_request} from '@/utils'
import React from 'react';
import * as Icon from '@ant-design/icons';


function getItem(label, key, children, path, icon, type) {
    return {
      key,
      icon,
      children,
      label,
      path,
      type,
    };
}


export default class MunuStore{
    constructor(){
        makeAutoObservable(this)
    }

    getMunes = async() => {
        const res = await axios_request.get("menu")
        const menuList = res.data.list
        const renderMenu = (menuList) => {
            return menuList.map(item => {
                if(item.children.length > 0){
                    return getItem(item.menu_name, item.menu_code, renderMenu(item.children), null, 
                                item.icon === null ? undefined : React.createElement(Icon[item.icon]))
                } 
                return getItem(item.menu_name, item.menu_code, null, item.url, 
                    item.icon === null ? undefined : React.createElement(Icon[item.icon]))
            })
        }
        return renderMenu(menuList)
    }
}
